<template>
  <rk-dialog width="85%"
    height="80%"
    title='专家注册'
    :visible="localVisible"
    :destroyOnClose="true"
    @close="localVisible = false"
    :maskClosable="false">
    <template #footer>
      <el-button type="primary"
        @click="onClickOk">确定
      </el-button>
      <el-button @click="localVisible=false">取消</el-button>
    </template>
    <RkFormRender ref="expertManageRef"
      :formCode="formCode"
      :formData="formData" />
  </rk-dialog>
</template>
<script setup>
import { ref } from "vue";
import { RkFormRender } from '@/components/designer';
import { useRoute } from "vue-router";
const route = useRoute();

const props = defineProps({
  ok: {
    type: [Promise, Function],
    default: () => {
      return new Promise(resolve => resolve())
    }
  },
  cancel: {
    type: Promise,
    default: () => {
      return new Promise(resolve => resolve())
    }
  }
})
const formCode = route.query.formCode
const formType = ref('add')
const formData = ref({})
const localVisible = ref(false)
const expertManageRef = ref()

const handleOpen = (type, data) => {
  localVisible.value = true
  formType.value = type
  formData.value = data

}
const handleClose = () => {
  localVisible.value = false
}
const onClickOk = async () => {
  const { validateFormData } = expertManageRef.value
  const valid = await validateFormData()
  if (valid) {
    const { getRenderFormData } = expertManageRef.value
    getRenderFormData().then(params => {
      // console.log(params);
      props.ok(formType.value, params.dataArray).then(() => {
        localVisible.value = false
      })
    })
  }

}

defineExpose({
  handleClose,
  handleOpen
})

</script>
<style lang="scss">
</style>
